import createModulePage from "../../../components/modulepage/index";

import { KxAppSubModule} from "../submodule";

import { HttpTaskTraits } from "../traits/http";

import { GLOBAL_APP_CLS } from "../../../variable";

import { pageName, componentName, refName } from "./variable";

class Module extends KxAppSubModule {
    constructor(name) {
        super(name);
    }
    _template() {
        var self = this;
        return `<div class="${self._name}">
    <div ref="${refName}" class="action app-action">
    </div>  
    <h5>准备</h5>                   
    <div>
         <ol>
            <li>
                <p><a href="https://gitee.com/lbc19920615/aui-admin.git" target="_blank">创建modules项目</a></p>                            
            </li>
            <li>
                <p>npm install</p>
            </li>
        </ol>  
    </div>
    <h5>目录</h5>
    <div>
    <pre><code>- components
    - datatable 数据表格
- modules
    - admin 全局框架模块
    - assets  资源文件模块
    - aunbox aunbox文件模块
    - element-ui  element ui引用模块    
    - global 全局文件模块
    - demo  项目模块 [App]
- vendor    
    - lib
        - element-ui  稳定的1.x版本
    index.js  主文件        
</code></pre>
</div>    
    <h5>开发modules</h5>   
    <div>       
        <ol>
            <li>
                <p>https://gitee.com/lbc19920615/aui-vendor.git src/admin/vendor</p>            
                <p>添加vendor</p>
            </li>
            <li>
                <p>git clone https://gitee.com/lbc19920615/aunbox-admin-demo.git src/admin/modules/demo</p>            
                <p>添加要编译的modules</p>
            </li>
        </ol>        
    </div>
</div>`;
    }   
    
    _traits(instance) {
        return [ 
            new HttpTaskTraits(instance, `private_${pageName}_traits`) 
        ]
    }

    _mounted() {        
        var self = this;         
        self[`private_${pageName}_traits`].init({
            onError: function (error) {
                if (self.$refs[refName]) {
                    window.app.onError(error)
                }
            }
        });

        setTimeout(function () {
            self.search();
        }, 0);

        window.AUIPrism.highlightAll();
    }
    _methods(instance) {
        return {
            search(page = 1) {
                var self = this;
            },
            onSearch(data) {
                var self = this;
                self.search();
            },
            onPageChange(page) {
                var self = this;
                self.search(page);
            }
        }
    }
    _data() {
        var ret = {};
        return ret;
    }  
}


window.AUICustomComponents.define(`kx-app-${pageName}-module`, Module);

export default createModulePage(
    `<kx-app-${pageName}-module></kx-app-${pageName}-module>`
);